<template>
  <div>
    <BreakSpace label="基本信息" :containerStyle="{ marginBottom: '15px' }" />
    <FormPanel ref="formPanel1" :list="formInfoList" labelWidth="100" :formType="type" :isSubmitBtn="false" />

    <BreakSpace label="价格信息" :containerStyle="{ marginBottom: '15px' }" />
    <FormPanel ref="formPanel" :list="formPriceList" labelWidth="100" :formType="type" :isSubmitBtn="false" />
    <FilterTable ref="table" :columns="priceColumns" :fetchapi="priceList" :params="priceParams" height="auto" :datakey="'records'" :isSelectColumn="false" :isToperInfo="false" :isColumnFilter="false" :isPagination="false" :onRowSelectChange="selectChange" :onColumnsChange="columns => (this.priceColumns = columns)">
    </FilterTable>

    <BreakSpace label="备件图片上传" :containerStyle="{ marginBottom: '15px' }" />
    <!-- <Spin :spinning="loading" tip="Loading..."> -->
      <FilterTable ref="picTable" :columns="picColumns" :dataSource="picsSrc" :params="picParams" height="auto" :datakey="'records'" :isSelectColumn="false" :isToperInfo="false" :isColumnFilter="false" :isPagination="false" :onColumnsChange="picColumns => (this.picColumns = picColumns)">
        <template slot="controls" v-if="type === 'edit'">
          <UploadFile v-if="type === 'edit'" :action-url='`${uploadPrefix}/api/file/oss/upload`' :initial-value="form.fileList" :fileTypes="['jpg', 'jpeg', 'png']" :fileSize="20" :isOnlyButton="true" :limit="picLimit" @change="handleSuccess">上传
          </UploadFile>
        </template>
      </FilterTable>
    <!-- </Spin> -->
    <ElImageViewer :url-list="picListTwo" v-show="imagesViewShow" :on-close="closeImagesViewer"></ElImageViewer>

    <BreakSpace label="3C证书上传" :containerStyle="{ marginBottom: '15px' }" />
    <!-- <Spin :spinning="loading2" tip="Loading..."> -->
      <FilterTable ref="picTable2" :columns="picColumns2" :dataSource="picsSrc2" :params="picParams2" height="auto" :datakey="'records'" :isSelectColumn="false" :isToperInfo="false" :isColumnFilter="false" :isPagination="false" :onColumnsChange="picColumns2 => (this.picColumns2 = picColumns2)">
        <template slot="controls" v-if="type === 'edit'">
          <UploadFile v-if="type === 'edit'" :action-url='`${uploadPrefix}/api/file/oss/upload`' :initial-value="form.fileList" :fileTypes="['jpg', 'jpeg', 'png']" :fileSize="20" :isOnlyButton="true" :limit="picLimit2" @change="handleSuccess2">上传
          </UploadFile>
        </template>
      </FilterTable>
    <!-- </Spin> -->
    <ElImageViewer :url-list="picListOne" v-show="imagesViewShow2" :on-close="closeImagesViewer2"></ElImageViewer>

    <BreakSpace label="替换件维护" :containerStyle="{ marginBottom: '15px' }" />
    <FilterTable ref="table" :columns="subPartColumns" :dataSource="subPartList" height="auto" :datakey="'records'" :isSelectColumn="false" :isToperInfo="false" :isColumnFilter="false" :onRowSelectChange="selectChange" :onColumnsChange="columns => (this.subPartColumns = columns)">
      <template slot="controls">
        <el-button size="small" v-if="type === 'edit' " type="primary" icon="el-icon-plus" @click="openAddDialog()">新增</el-button>
      </template>
    </FilterTable>
    <BaseDialog :visible.sync="showSubPart" :title="'替换件查询'" destroyOnClose width="800px" :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <addSubPart :partData="partData" :replaceList="replaceList" @close="closeHandler" />
    </BaseDialog>

    <div :style="{ textAlign: 'center' }">
      <el-button @click="saveDialog" type="primary" :loading="saveLoading" v-if="type === 'edit'">保 存</el-button>
      <el-button @click="closeDialog">返 回</el-button>
    </div>
  </div>
</template>

<script>
import { findPartTypeList,findModelList, updatePartInfo, getPartSupplier, getPartPrice, getSubPartList, deletePartPicFile } from '@/api/partsmanage/partinfos/partInfoManage/index';
import { dictionary } from '@/utils/dictMixin';
import { getFiles } from '@/api/partsmanage/common/file';
import addSubPart from './addSubPart';
import { getUserId } from '@/assets/js/auth';
import { notifyAction } from '@/utils';
import { positiveInteger } from '@/utils/validate';
import config from '@/assets/js/config';
import moment from 'moment';
import axios from '@/api/fetch';
import ElImageViewer from 'element-ui/packages/image/src/image-viewer';

export default {
  name: 'partInfo',
  mixins: [dictionary],
  components: { addSubPart, ElImageViewer },
  props: {
    type: { type: String, default: 'add' },
    rowData: { type: Object, default: () => ({}) }
  },
  data() {
    return {
      picListTwo: [],
      picListOne: [],
      uploadPrefix: config.uploadUrl,// 附件上传前缀
      uploadAction: config.uploadUrl + '/api/file/v1/file/upload',
      loading: false,
      loading2: false,
      uploadData: { bucketType: 'private', fileName: '' },
      picLimit: 5,
      picLimit2: 99,
      picsSrc: [],
      picsSrc2: [],
      imagesViewShow: false,
      imagesViewShow2: false,
      picParams: { xtdjid: '', xtfjlx: 'tt_part_info' },
      picParams2: { xtdjid: '', xtfjlx: 'tt_part_info' },
      picColumns: this.createPicTable(),
      picColumns2: this.createPicTable2(),
      formInfoList: this.createFormInfoList(),
      formPriceList: this.createFormPriceList(),
      // picList: this.createPicList(),
      columns: this.createTableColumns(),
      priceColumns: this.createPriceTable(),
      subPartColumns: this.createSubPartTable(),
      activeName: 'first',
      saveLoading: false,
      fetchApi: getPartSupplier,
      priceList: getPartPrice,
      subPartList: [],
      fetchParams: { id: '' },
      priceParams: { partInfoId: '', xtlxdm: 'LS' },
      subPartParams: { mainPartId: '' },
      form: { fileList: [] },
      partId: '',
      partData: {},
      replaceList: {},
      showSubPart: false,
      modelList: [],
      partTypeList:[],
      isDisable: false,

    };
  },
  created() {
    this.fetchParams.id = this.rowData.id;
    this.priceParams.partInfoId = this.rowData.id;
    this.subPartParams.mainPartId = this.rowData.id;
    this.partData = this.rowData;
    this.init(this.rowData);
  },
  methods: {
    async deletePic2(val) {
      this.$confirm('确定删除此文件吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        let picIndex = 0;
        if (val.id != null && val.id > 0) {
          const res = await deletePartPicFile({ id: val.id, partId: this.rowData.id });
          if (res.resultCode === 200) {
            this.$refs.picTable2.$refs.pageTable.EXECUTE_DELETE([val]);
            this.picsSrc2.forEach(x => {
              this.$set(x, 'index', picIndex++);
            });
            this.$notify.success({ title: '提示信息', message: '删除成功!' });
          }
        } else {
          this.$refs.picTable2.$refs.pageTable.EXECUTE_DELETE([val]);
          this.picsSrc2.forEach(x => {
            this.$set(x, 'index', picIndex++);
          });
          this.$notify.success({ title: '提示信息', message: '删除成功!' });
        }
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消'
        });
      });
    },
    async deletePic(val) {
      this.$confirm('确定删除此文件吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        let picIndex = 0;
        if (val.id != null && val.id > 0) {
          const res = await deletePartPicFile({ id: val.id, partId: this.rowData.id });
          if (res.resultCode === 200) {
            this.$refs.picTable.$refs.pageTable.EXECUTE_DELETE([val]);
            this.picsSrc.forEach(x => {
              this.$set(x, 'index', picIndex++);
            });
            this.$notify.success({ title: '提示信息', message: '删除成功!' });
          }
        } else {
          this.$refs.picTable.$refs.pageTable.EXECUTE_DELETE([val]);
          this.picsSrc.forEach(x => {
            this.$set(x, 'index', picIndex++);
          });
          this.$notify.success({ title: '提示信息', message: '删除成功!' });
        }
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消'
        });
      });
    },
    closeImagesViewer() {
      this.imagesViewShow = false;
    },
    closeImagesViewer2() {
      this.imagesViewShow2 = false;
    },
    async getPicUrl(url) {
      let actionUrl = this.uploadPrefix + '/api/file/download/url?fileUrl=' + url;
      let res = await axios.post(actionUrl);
      return res.data;
    },
    handleError(err, file, fileList) {
      this.$notify.error('上传失败：' + err);
    },
    handleExceed(files, fileList) {
      this.$notify.warning('图片最多只可上传5张！');
    },
    handleExceed2(files, fileList) {
      this.$notify.warning('图片最多只可上传99张！');
    },
    getFileType(fileName) {
      let fileType = fileName.substring(fileName.lastIndexOf('.') + 1, fileName.length);
      return fileType;
    },
    // 上传成功回调
    handleSuccess(response, file, fileList) {
      this.loading = true;
      //let res = this.getPicUrl(response.data);
      console.log('response',response)
      if (response == 1) {
        this.loading = false;
      } else {
        let data = { index: '', name: '', url: '', xtwjmc: '', xtwjlj: '' };
        this.$set(data, 'index', this.picsSrc.length);
        this.$set(data, 'name', response[response.length - 1].name);
        this.$set(data, 'xtwjmc', response[response.length - 1].name);
        this.$set(data, 'xtwjlj', response[response.length - 1].url);
        this.getPicUrl(response[response.length - 1].url).then(res => {
          this.$set(data, 'url', res);
          if (this.getFileType(data.name) != 'pdf') {
            this.picListTwo.push(data.url);
          }
          this.picsSrc.push(data);
        });
        this.$notify.success({ title: '提示信息', message: '上传成功!' });
        this.loading = false;
      }
    },
    // 上传成功回调
    handleSuccess2(response, file, fileList) {
      this.loading2 = true;
      //let res = this.getPicUrl(response.data);
      console.log(response)
      if (response == 1) {
        this.loading = false;
      } else {
        let data = { index: '', name: '', url: '', xtwjmc: '', xtwjlj: '' };
        this.$set(data, 'index', this.picsSrc.length);
        this.$set(data, 'name', response[response.length - 1].name);
        this.$set(data, 'xtwjmc', response[response.length - 1].name);
        this.$set(data, 'xtwjlj', response[response.length - 1].url);
        this.getPicUrl(response[response.length - 1].url).then(res => {
          this.$set(data, 'url', res);
          if (this.getFileType(data.name) != 'pdf') {
            this.picListOne.push(data.url);
          }
          console.log('data',data)
          this.picsSrc2.push(data);
        });
        this.$notify.success({ title: '提示信息', message: '上传成功!' });
        this.loading2 = false;
      }
    },
    handleBeforeUpload(file) {
      let fileType = this.getFileType(file.name);
      if (fileType != 'jpg' && fileType != 'jpeg' && fileType != 'png') {
        this.$notify.warning('上传的图片格式应为[.jpg, .jpeg, .png]!');
        return false;
      }
      let fileName = file.name.substring(0, file.name.lastIndexOf('.')) + `-${moment().format('YYYY-MM-DD')}`;
      this.uploadData.fileName = fileName;
      this.loading = true;
      const isLt1M = file.size / 1024 / 1024 < 1;
      if (!isLt1M) {
        this.$notify.warning('上传的图片大小不能超过 1MB!');
      }
      this.loading = false;
      return isLt1M;
    },
    createPicTable() {
      return [
        {
          title: '序号', dataIndex: 'index', width: 70, sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '操作', dataIndex: 'column-action', width: 150, align: 'center',
          hidden: this.type == 'show',
          render: props => {
            return (
              <div>
                <el-button size="mini" type="text" onClick={() => this.deletePic(props.row)}>
                  删除
                </el-button>
              </div>
            );
          }
        },
        {
          title: '图片（图片格式：jpg, jpeg, png；不大于20M）', dataIndex: 'name', align: 'center',
          render: p => {
            return (
              <div class="imgfile">
                <img src={p.row.url} onClick={() => { this.imagesViewShow = true; this.picListTwo = [p.row.url] }} alt="" />
                {p.row.name}
              </div>
            );
          }
                // <a href={p.row.url} target="_blank">{p.row.name}</a>
        }
      ]
    },
    createPicTable2() {
      return [
        {
          title: '序号', dataIndex: 'index', width: 70, sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        {
          title: '操作', dataIndex: 'column-action', width: 150, align: 'center',
          hidden: this.type == 'show',
          render: props => {
            return (
              <div>
                <el-button size="mini" type="text" onClick={() => this.deletePic2(props.row)}>
                  删除
                </el-button>
              </div>
            );
          }
        },
        {
          title: '图片（图片格式：jpg, jpeg, png；不大于20M）', dataIndex: 'name', align: 'center',
          render: p => {
            return (
              <div class="imgfile">
                <img src={p.row.url} onClick={() => { this.imagesViewShow2 = true; this.picListOne = [p.row.url] }} alt="" />
                {p.row.name}
              </div>
            );
          }
                // <a href={p.row.url} target="_blank">{p.row.name}</a>
        }
      ]
    },
    selectChange(val) {
      this.rowSelectData = val;
    },
    init(data) {
      this.partId = data.id;
      console.log('rowData',this.rowData)
      this.formInfoList.forEach(x => {
        console.log('x',x)
        if (x.fieldName == 'bjsycx' && this.rowData[x.fieldName] && this.rowData[x.fieldName] != null) {
          let initValue = this.rowData[x.fieldName].split(";");
          x.initialValue = initValue;
        }
        // 当物料组 为 沿用件（30541002）
        else if(x.fieldName == "material"){
          let initValue = this.rowData[x.fieldName];
          if (initValue != '') {
            x.initialValue = Number(initValue);
          }
          console.log('SHDKHSJKAHDJK',x.initialValue)
          if (x.initialValue == 30541002) {
              this.formInfoList.find(x => x.fieldName == 'bjxszx').disabled = true
              this.formInfoList.find(x => x.fieldName == 'bjxsbz').disabled = true
          }
        }else {
          x.initialValue = this.rowData[x.fieldName];
        }
      });
      this.formPriceList.forEach(x => {
        x.initialValue = this.rowData[x.fieldName];
      });
      getFiles({ "id": this.partId, "serialNum": "1001" }).then(response => {
        this.picsSrc = response.data;
        this.picsSrc.forEach(x => {
          x.xtwjmc = x.name;
          x.xtwjlj = x.url;
          this.getPicUrl(x.url).then(res => {
            x.url = res;
            if (this.getFileType(x.name) != 'pdf') {
              this.picListTwo.push(res);
            }
          });
        });
      });
      getFiles({ "id": this.partId, "serialNum": "1002" }).then(response => {
        this.picsSrc2 = response.data;
        this.picsSrc2.forEach(x => {
          x.xtwjmc = x.name;
          x.xtwjlj = x.url;
          this.getPicUrl(x.url).then(res => {
            x.url = res;
            if (this.getFileType(x.name) != 'pdf') {
              this.picListOne.push(res);
            }
          });
        });
      });
      findModelList().then(res => {
        this.modelList = res.data;
        this.formInfoList.find(x => x.fieldName == 'bjsycx').itemList = this.modelList;
      });
      findPartTypeList().then(res => {
        this.partTypeList = res.data;
        this.formInfoList.find(x => x.fieldName == 'bjpjfl').itemList = this.partTypeList;
      });
      getSubPartList({ "mainPartId": this.partId }).then(res => {
        this.subPartList = res.data;

      })
    },
    createFormInfoList() {
      return [
        { type: 'INPUT', label: '备件代码', fieldName: 'bjxmbh', disabled: true },
        { type: 'INPUT', label: '备件名称', fieldName: 'bjzwmc', disabled: true },
        { type: 'SELECT', label: '物料组', fieldName: 'material',disabled: true, itemList: this.createDictList(3054),
          clearable: false,
        },
        { type: 'MULTIPLE_SELECT', label: '适用车型', fieldName: 'bjsycx', itemList: [] , },
        { type: 'SELECT', label: '备件类别', fieldName: 'bjpjfl', itemList: [] },
        { type: 'INPUT', label: '单位', fieldName: 'bjdanw', disabled: true },
        { type: 'SELECT', label: '是否紧急件', fieldName: 'bjdebz', itemList: this.createDictList('1004'), clearable: false },
        {
          type: 'INPUT', label: '销售包装量', fieldName: 'bjxszx', initialValue: 1,disabled: false ,
          rules: [
            {
              validator: positiveInteger,
              message: '格式不正确',
              trigger: 'change'
            },
          ],
          // render: props => {
          //   console.log('props', props );
          //   if(this.formInfoList.find(x => x.fieldName == 'material'.initialValue)===30541002){
          //     console.log('xxxxxxxxxxxxxxxxxxxxxxxxxxxx',this.formInfoList.find(x => x.fieldName == 'material'.initialValue));
          //     this.formInfoList.find(x => x.fieldName == 'bjxszx').disabled = true
          //   }
          // }
        },
        { type: 'SELECT', label: '销售标识', fieldName: 'bjxsbz', itemList: this.createDictList('1004'), clearable: false },
        { type: 'SELECT', label: '是否特殊件', fieldName: 'bjtsbz', itemList: this.createDictList('1004'), clearable: false },
        // { type: 'INPUT', label: '采购包装量', fieldName: 'bjcgzx', disabled: true },
        // { type: 'SELECT', label: '采购标识', fieldName: 'bjcgbz', itemList: this.createDictList('1004') },
        { type: 'INPUT', label: '备注', fieldName: 'remark', selfCols: 2, maxlength: 150 }
      ];
    },
    createFormPriceList() {
      return [
        { type: 'INPUT', label: '服务商进价', fieldName: 'xs', disabled: true, numberFormat: true, precision: 2, },
        {
          type: 'INPUT',
          label: '终端销售价',
          fieldName: 'ls',
          disabled: true,
          numberFormat: true,
          precision: 2
        },
        { type: 'INPUT', label: '备注', fieldName: 'bjjgbz', maxlength: 150 }
      ];
    },
    createPriceTable() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        { title: '终端销售价', dataIndex: 'xtjgjg', sorter: true, numberFormat: true, precision: 2 },
        { title: '生效时间', dataIndex: 'xtyxrq', dateFormat: 'yyyy-MM-dd HH:mm:ss', sorter: true },
        { title: '失效时间', dataIndex: 'xtsxrq', dateFormat: 'yyyy-MM-dd HH:mm:ss', sorter: true },
        { title: '操作人', dataIndex: 'updatedBy', sorter: true },
        { title: '操作时间', dataIndex: 'updatedAt', dateFormat: 'yyyy-MM-dd HH:mm:ss', sorter: true }
      ];
    },
    // createPicList() {
    //   return [
    //     {
    //       type: 'UPLOAD_FILE',
    //       selfCols: 3,
    //       label: '备件图片上传：',
    //       fieldName: 'picsSrc',
    //       placeholder: '上传图片...',
    //       initialValue:[],
    //       upload: {
    //         actionUrl: '/api/file/oss/upload',
    //         fileTypes: ['jpg', 'jpeg', 'png'],
    //         limit:5
    //       }
    //     },
    //     {
    //       type: 'UPLOAD_FILE',
    //       selfCols: 3,
    //       label: '3C证书上传：',
    //       fieldName: 'src3C',
    //       placeholder: '上传图片...',
    //       initialValue:[],
    //       upload: {
    //         actionUrl: '/api/file/oss/upload',
    //         fileTypes: ['jpg', 'jpeg', 'png'],
    //         limit:99
    //       }
    //     }
    //   ]
    // },
    createSubPartTable() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        { title: '替换件代码', dataIndex: 'replacePartCode', sorter: true },
        { title: '替换件名称', dataIndex: 'replacePartName', sorter: true },
        { title: '替换件价格', dataIndex: 'replacePartPrice', sorter: true, numberFormat: true , precision: 2},
        {
          title: '操作',
          dataIndex: 'column-action',
          width: 100,
          fixed: 'right',
          render: props => {
            return (
              <div>
                <el-button size="mini" disabled={this.type === "show"} type="text" onClick={() => this.deleteHandle(props.$index)}>
                  删除
                </el-button>
              </div>
            );
          }
        }
      ];
    },
    createTableColumns() {
      return [
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          sorter: true,
          render: props => {
            return <span>{props.row.index + 1}</span>;
          }
        },
        { title: '供应商代码', dataIndex: 'bjgybm', sorter: true },
        { title: '供应商名称', dataIndex: 'bjgyjc', sorter: true },
        { title: '生效时间', dataIndex: 'xtyxrq', dateFormat: 'yyyy-MM-dd HH:mm:ss', sorter: true },
        { title: '失效时间', dataIndex: 'xtsxrq', dateFormat: 'yyyy-MM-dd HH:mm:ss', sorter: true }
      ];
    },
    deleteHandle(index) {
      this.$confirm('确认删除', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          this.subPartList.splice(index, 1);
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
    },
    // deleteHandle(val) {
    //   this.$confirm('确定删除此替换件吗？', '提示', {
    //     confirmButtonText: '确定',
    //     cancelButtonText: '取消',
    //     type: 'warning'
    //   }).then(async () => {
    //     const res = await deletePartRelation({ id:val.id });
    //     if (res.resultCode === 200) {
    //       this.$notify.success({ title: '提示信息', message: '删除成功!' });
    //       this.subPartParams = { ...this.subPartParams };
    //     }
    //   }).catch(() => {
    //     this.$message({
    //       type: 'info',
    //       message: '已取消'
    //     });
    //   });

    // },
    async saveDialog() {
      let [err1, data] = await this.$refs.formPanel1.GET_FORM_DATA();
      if (err1) {
        return false;
      }

      const err = this.$refs.formPanel.SUBMIT_FORM();
      if (err === null) {
        return false;
      }
      let bjdebz = this.formInfoList.find(x => x.fieldName == 'bjdebz').initialValue;
      let bjtsbz = this.formInfoList.find(x => x.fieldName == 'bjtsbz').initialValue;
      if (bjdebz === 10041001 && bjdebz === bjtsbz) {
        return notifyAction('紧急件与特殊件为互斥关系!', 'error');
      }
      this.saveLoading = true;
      let json = {};
      this.$set(json, 'id', this.rowData.id);
      this.$set(json, 'userId', getUserId());
      this.formInfoList.forEach(x => {
        this.$set(json, x.fieldName, x.initialValue);
      });
      this.formPriceList.forEach(x => {
        console.log(x.fieldName, x.initialValue)

        if(x.initialValue != null && x.initialValue != undefined && x.fieldName != 'bjjgbz'){
          this.$set(json, x.fieldName, x.initialValue.replace(/, /g,''));
        }else{
          this.$set(json, x.fieldName, x.initialValue);

        }
      });
      // this.picList.forEach(x => {
      //   this.$set(json, x.fieldName, x.initialValue);
      // });
      this.$set(json, 'picsSrc', this.picsSrc);
      this.$set(json, 'src3C', this.picsSrc2);
      this.$set(json, 'replacePartList', this.subPartList);

      const res = await updatePartInfo(json);
      if (res.resultCode === 200) {
        this.$notify.success({ title: '提示信息', message: '修改成功!' });
        this.closeDialog('refresh');
      }
      this.saveLoading = false;
    },
    openAddDialog() {
      this.showSubPart = true;
      this.replaceList = this.subPartList;
    },
    closeHandler(val) {
      this.showSubPart = false;
      this.subPartParams = { ...this.subPartParams };
      this.addSelectReplacePart(val.data);
    },
    //添加选择经销商角色到列表中
    addSelectReplacePart(val) {

      if (val != null && typeof val != 'undefined' && val.length > 0) {
        val.forEach(item => {
          let value = item.id;
          if (!this.isExistInlistReplacePart(value)) {
            let param = {
              index: this.subPartList.length,
              appId: item.appId,
              mainPartId: this.partId,
              replacePartId: item.id,
              replacePartCode: item.bjxmbh,
              replacePartName: item.bjzwmc,
              replacePartPrice: item.xs
            }
            this.subPartList.push(param);
          }
        });
        // this.listDealerRole.dataMark = false;
      }
    },
    isExistInlistReplacePart(value) {
      let r = false;
      if (this.subPartList && this.subPartList.length > 0) {
        for (let dIdx = 0; dIdx < this.subPartList.length; dIdx++) {
          let tcode = this.subPartList[dIdx].replacePartId;
          if (tcode === value) {
            r = true;
            break;
          }
        }
      }
      return r;
    },
    closeDialog(param) {
      this.$emit('close', { visible: false, type: param });
    }
  }
};
</script>


<style scoped>
.el-table__body-wrapper {
  overflow-x: auto;
  position: static;
}
.el-image {
  float: left;
  margin-left: 130px;
}
/* .el-image a {
    float: left;
} */
.imgfile {
  height: 60px;
  line-height: 60px;
  overflow: hidden;
}
.imgfile a {
  float: left;
  margin-left: 20px;
}
.imgfile img {
  float: left;
  margin-left: 30%;
  width: 100px;
  height: 100%;
  object-fit: cover;
}
.pdfdiv {
  float: left;
  margin-left: 30%;
  width: 100px;
  height: 100%;
  object-fit: cover;
}
/deep/.el-icon-circle-close:before {
    content: "\e78d";
    color: red !important;
}
</style>
